<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./styles/goods-list.css">
    <script src="./javascripts/libs/jquery.min.js"></script>

    <script src="./javascripts/libs/public.js"></script>

    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1577286_pw2zrt49mpb.css">

    <link rel="stylesheet" href="./styles/page.css">

    <script src="./javascripts/libs/xlPaging.js"></script>

    <script src="./javascripts/libs/jquery.cookie.js"></script>

</head>

<body>
    <!-- 顶部通版区 -->
    <div class="ding-tong">
        <div class="ding-safe">
            <ul>
                <li> 欢迎进入钻石小鸟官网</li>
                <li> <a href="login.html">登录</a></li>
                <li><a href="register.html">注册</a></li>
            </ul>

            <dl>
                <dd>
                    MemberOfZbird
                </dd>
                <dd>
                    <span></span>
                </dd>
                <dd class="signout">
                    <a href="">退出登录</a>
                </dd>
            </dl>
            <script>
                var timer = new Date()
                var hour = timer.getHours()
                if (hour <= 12 && hour > 0) {
                    $('dl dd span').html('上午好:')

                }
                if (hour > 12 && hour <= 18) {
                    $('dl dd span').html('下午好:')
                }
                if (hour > 18 && hour < 24) {
                    $('dl dd span').html('晚上好:')
                }
            </script>
            <script>
                var cookie_string = getCookie("USR");
                var nav_list = document.querySelector(".ding-safe ul");
                var user_name = document.querySelector(".ding-safe dl");
                try {
                    // 因为在这里存在报错的可能,所以尽量把这段代码放在try catch里面;
                    var cookie_array = JSON.parse(cookie_string);
                    user_name.className += " active";
                    // user_name.innerHTML = cookie_array.username;
                } catch (e) {
                    // 一旦 catch 则表示登陆状态不正确;
                    nav_list.className += " active";
                }

                // 退出登陆;         
                var signout = document.querySelector(".signout");
                signout.onclick = function () {
                    removeCookie("USR", "/");
                    location.onload();
                };
            </script>

            <p>
                <img src="http://img.zbird.cn/ww3/pubheaderfooter/header_box.png" alt="">
                <a href="javascript:void(0)">购物车</a>
                <span class="count" style="color: #ff8a81;">0</span>
                <i class="iconfont icon-xiajiantou"></i>
            </p>
            <ol>
                <li>我的订单</li>
                <li>我的鸟巢</li>
                <li>钻石课堂</li>
                <li>手机官网</li>
            </ol>
        </div>
    </div>
    <script>
        // console.log($.cookie('USR'));
        $('.ding-safe p').click(function () {
            if ($.cookie('USR') === undefined) {
                location.assign("./cart_dis.html")
            }
        })
    </script>


    <header>
        <div class="header-safe">
            <div class="logo">
                <a href="./index.html">
                    <img src="http://im1.zbird.cn/picdb/555/518/f6aa96185bbd30da859cc7278a7d1d4a.png" alt="">
                </a>
            </div>

            <div class="biaoyu">
                <img src="http://img.zbird.cn/ww3/pubheaderfooter/pcslogan.png" alt="">
            </div>


            <p>
                <a href="./promotion.html" class="btn">
                </a>
            </p>

            <div class="search">
                <input type="text">
                <a href=""></a>

            </div>
        </div>

    </header>

    <!-- 导航条 -->
    <!-- 导航条 二级菜单-->
    <nav>
        <div class="dh">
            <p><a href="./index.html">首页</a></p>

            <ul>
                <li>
                    <a href="./goods-list.html">钻石</a>

                    <div class="m_idx_snav_wp">
                        <div class="snav_title">
                            <a href="#" class="snav_title_txtimg">钻石</a>
                            <a href="#" class="snav_title_txt">探索全部钻石</a>
                            <div class="snav_lst">
                                <a href="#">30分裸钻</a>
                                <a href="#">50分裸钻</a>
                                <a href="#">70分裸钻</a>
                                <a href="#">克拉钻</a>
                                <a href="#">海淘钻石 立省15%</a>
                                <a href="#">北极光钻石</a>
                                <a href="#">FireCushion钻石</a>
                            </div>
                        </div>
                        <div class="snav_lst">
                            <a href="http://www.zbird.com/diamond/g1x1/">圆形</a>
                            <a href="http://www.zbird.com/diamond/g2x2/">公主方</a>
                            <a href="http://www.zbird.com/diamond/g2x7/">祖母绿</a>
                            <a href="http://www.zbird.com/diamond/g2x5/">橄榄形</a>
                            <a href="http://www.zbird.com/diamond/g2x6/">椭圆形</a>
                            <a href="http://www.zbird.com/diamond/g2x4/">梨形</a>
                            <a href="http://www.zbird.com/diamond/g2x3/">心形</a>
                            <a href="http://www.zbird.com/diamond/g1x1/"></a>
                        </div>
                        <div class="navline"></div>
                        <div class="snav_lst lstpoa">
                            <a href="http://www.zbird.com/dingzhi/r-d-0-0-0-0-0-0-0-0-1-0.html">定制一款钻戒</a>
                            <a href="http://www.zbird.com/dingzhi/n-g-0-0-0-0-0-0-0-0-1-0.html">定制一款吊坠</a>
                            <a href="http://www.zbird.com/zhishi/zuanshi4c.html">钻石4C知识</a>
                            <a href="http://www.zbird.com/zhishi/information.html">钻石其他参数如何查看</a>
                            <a href="http://www.zbird.com/zhishi/diamondcert.html">钻石证书知识</a>
                            <a href="http://www.zbird.com/diamond/tehui/">甄选特惠裸钻专区</a>
                            <a href="http://www.zbird.com/e-education/w16440.html">钻戒品牌排行</a>
                        </div>
                        <div class="snav_ads">
                            <a href="http://www.zbird.com/act/2016globediamonds.html?from=zsxl"><img
                                    src="  http://img.zbird.cn/picdb/555/782/ee93e31aa48f031dda79ea274a8e4909.jpg"
                                    alt="" width="611" height="262"></a>
                        </div>
                    </div>
                    </h1>
                </li>

                <li>
                    <a href="">婚戒</a>
                    <div class="m_idx_snav_wp">
                        <div class="snav_title">
                            <a href="http://www.zbird.com/weddings/" class="snav_title_txtimg">婚戒</a>
                            <a href="http://www.zbird.com/weddings/" class="snav_title_txt">探索全部婚戒</a>
                            <div class="snav_lst">
                                <a href="http://www.zbird.com/weddings/r-d-0-0-0-0-1768-0-0-2-1.html">简约独钻</a>
                                <a href="http://www.zbird.com/weddings/r-d-0-0-0-0-1769-0-0-2-1.html">奢华群镶</a>
                                <a href="http://www.zbird.com/weddings/r-d-0-0-6-0-0-0-0-2-1.html">克拉钻戒</a>
                                <a href="http://www.zbird.com/weddings/r-c-0-0-0-0-0-0-0-2-1.html">大气男戒</a>
                                <a href="http://www.zbird.com/weddings/r-d-1820-0-0-0-0-0-0-2-1.html">纪念戒/花戒</a>
                                <a href="http://www.zbird.com/dingzhi/r-d-0-0-0-0-0-0-0-2-1.html">戒托款式</a>
                                <a href="http://www.zbird.com/weddings/r-d-0-0-0-0-0-0-0-4-1.html">人气热销</a>
                            </div>
                        </div>
                        <div class="snav_lst">
                            <a href="http://www.zbird.com/mono/2019aurorachasinglight.html">北极光追光系列</a>
                            <a href="http://www.zbird.com/mono/2017ladynewyork.html">LADY NEW YORK系列</a>
                            <a href="http://www.zbird.com/mono/2018gongzhuguiguan.html">公主桂冠系列</a>
                            <a href="http://www.zbird.com/mono/2017heartinheart.html">心心相印系列</a>
                            <a href="http://www.zbird.com/mono/2015sweetlove.html">宠爱系列</a>
                        </div>
                        <div class="navline"></div>
                        <div class="snav_lst lstpoa">
                            <a href="http://www.zbird.com/zhishi/ringsize.html">如何测量手寸</a>
                            <a href="http://www.zbird.com/zhishi/ringtypes.html">如何挑选适合的戒指款式</a>
                            <a href="http://www.zbird.com/zhishi/metals.html">如何选购戒托材质</a>
                            <a href="http://www.zbird.com/zhishi/sourcing.html">匠心工艺</a>
                            <a href="http://www.zbird.com/e-education/w26863.html">送男人什么礼物最难忘</a>
                            <a href="http://www.zbird.com/e-education/w12175.html">一克拉钻戒多少钱</a>
                            <a href="http://www.zbird.com/e-education/w16331.html">项链品牌</a>

                        </div>
                        <div class="snav_ads">
                            <a href="http://www.zbird.com/mono/2019aurorachasinglight.html?from=hjxl"><img
                                    src="http://imp.zbird.cn/608/81/60881_1" alt="" width="611" height="262"></a>
                        </div>
                    </div>
                </li>

                <li>
                    <a href="">对戒</a>
                    <div class="m_idx_snav_wp">
                        <div class="snav_title">
                            <a href="#" class="snav_title_txtimg">对戒</a>
                            <a href="#" class="snav_title_txt">探索全部对戒</a>
                            <div class="snav_lst">
                                <a href="#">18K金对戒</a>
                                <a href="#">铂金对戒</a>
                                <a href="#">男款对戒</a>
                                <a href="#">女款对戒</a>
                                <a href="#">热销款式</a>
                            </div>
                        </div>
                        <div class="snav_lst">
                            <a href="#">北极光追光系列</a>
                            <a href="#">INTO COLOUR悦色系列</a>
                            <a href="#">两人一世戒系列</a>
                            <a href="#">YOU&ME系列</a>
                        </div>
                        <div class="navline"></div>
                        <div class="snav_lst lstpoa">
                            <a href="http://www.zbird.com/e-education/w13084.html">订婚男方要准备什么</a>
                            <a href="http://www.zbird.com/e-education/w16903.html">户外婚礼</a>
                            <a href="http://www.zbird.com/e-education/w16433.html">1克拉钻戒</a>
                            <a href="http://www.zbird.com/e-education/w17090.html">gia证书</a>
                            <a href="http://www.zbird.com/e-education/w13323.html">首饰品牌</a>
                            <a href="http://www.zbird.com/e-education/w21530.html">送女性朋友礼物排行榜</a>
                            <a href="http://www.zbird.com/e-education/w12105.html">1克拉结婚钻戒多少钱</a>

                        </div>
                        <div class="snav_ads">
                            <a href="http://www.zbird.com/mono/2018youandme.html?from=djxl"><img
                                    src="http://imu.zbird.cn/548/06/54806_1" alt="" width="611" height="262"></a>
                        </div>
                    </div>

                </li>
                <li>
                    <a href="">配饰</a>
                    <div class="m_idx_snav_wp">
                        <div class="snav_title">
                            <a href="http://www.zbird.com/accessory/" class="snav_title_txtimg">配饰</a>
                            <a href="http://www.zbird.com/accessory/" class="snav_title_txt">探索全部配饰</a>
                            <div class="snav_lst">
                                <a href="http://www.zbird.com/accessory/c-g-0-0-0-0-0-2-1.html">挂坠</a>
                                <a href="http://www.zbird.com/accessory/c-h-0-0-0-0-0-2-1.html">项链坠</a>
                                <a href="http://www.zbird.com/accessory/c-e-0-0-0-0-0-2-1.html">耳钉</a>
                                <a href="http://www.zbird.com/accessory/c-m-0-0-0-0-0-2-1.html">手链</a>
                                <a href="http://www.zbird.com/accessory/c-n-0-0-0-0-0-2-1.html">手镯</a>
                                <a href="http://www.zbird.com/accessory/c-i-0-0-0-0-0-2-1.html">项链</a>
                                <a href="http://www.zbird.com/accessory/c-c-0-0-0-0-0-4-1.html">人气TOP</a>
                            </div>
                        </div>
                        <div class="snav_lst">
                            <a href="http://www.zbird.com/mono/2019aurorachasinglight.html">北极光追光系列</a>
                            <a href="http://www.zbird.com/mono/2018sebtxzxl.html">生而不同星座系列</a>
                            <a href="http://www.zbird.com/mono/2016blinkcollection.html">BLINK系列</a>
                            <a href="http://www.zbird.com/mono/2019intocolourss.html">INTO COLOUR悦色系列-秘密花园</a>
                            <a href="http://www.zbird.com/mono/2019xzxl.html">HOROSCOPE STAR星座系列</a>
                            <a href="http://www.zbird.com/mono/2019ysxxy.html">小幸运系列</a>
                        </div>
                        <div class="navline"></div>
                        <div class="snav_lst lstpoa">
                            <a href="http://www.zbird.com/e-education/w18597.html">闺蜜结婚送什么礼物好</a>
                            <a href="http://www.zbird.com/e-education/w12088.html">戒指品牌</a>
                            <a href="http://www.zbird.com/e-education/w25670.html">一克拉钻戒大概多钱</a>
                            <a href="http://www.zbird.com/e-education/w18648.html">老婆生日送什么礼物</a>
                            <a href="http://www.zbird.com/e-education/w26869.html">送成熟男士礼物排行榜</a>
                            <a href="http://www.zbird.com/e-education/w16512.html">生日礼物送什么好</a>
                            <a href="http://www.zbird.com/e-education/w12520.html">结婚戒指戴哪个手指</a>

                        </div>
                        <div class="snav_ads">
                            <a href="http://www.zbird.com/mono/2019xzxl.html?from=psxl"><img
                                    src="http://imu.zbird.cn/611/14/61114_1" alt="" width="611" height="262"></a>
                        </div>
                    </div>
                </li>
                <li>
                    <a href="">定制</a>
                    <div class="m_idx_snav_wp">
                        <div class="snav_title">
                            <a href="http://www.zbird.com/dingzhi/index.html/" class="snav_title_txtimg">定制</a>
                            <a href="http://www.zbird.com/dingzhi/index.html/" class="snav_title_txt">探索全部定制</a>
                            <div class="snav_lst">
                                <a href="http://www.zbird.com/dingzhi-zuanshi/style-0-0.html">从裸钻开始定制</a>
                                <a href="http://www.zbird.com/dingzhi/r-d-0-0-0-0-0-0-0-0-1-0.html">从戒托开始定制</a>
                                <a href="http://www.zbird.com/dingzhi/n-g-0-0-0-0-0-0-0-0-1-0.html">从吊坠托开始定制</a>
                            </div>
                        </div>
                        <div class="snav_lst">
                            <a href="http://www.zbird.com/dingzhi/r-d-2-0-0-0-0-0-0-0-1-0.html">经典直臂款戒托</a>
                            <a href="http://www.zbird.com/dingzhi/r-d-3-0-0-0-0-0-0-0-1-0.html">简约扭臂款戒托</a>
                            <a href="http://www.zbird.com/dingzhi/r-d-7-0-0-0-0-0-0-0-1-0.html">异型钻款戒托</a>
                            <a href="http://www.zbird.com/dingzhi/r-d-9-0-0-0-0-0-0-0-1-0.html">北极光款戒托</a>
                            <a href="http://www.zbird.com/dingzhi/r-d-10-0-0-0-0-0-0-0-1-0.html">火玫瑰款戒托</a>
                        </div>
                        <div class="navline"></div>
                        <div class="snav_lst lstpoa">
                            <a href="http://www.zbird.com/zhishi/zuanshi4c.html">钻石4C</a>
                            <a href="http://www.zbird.com/zhishi/ringtypes.html">戒托款式</a>
                            <a href="http://www.zbird.com/zhishi/metals.html">戒托材质</a>
                            <a href="http://www.zbird.com/zhishi/ringsize.html">手寸测量</a>
                            <a href="http://www.zbird.com/e-education/w15725.html">结婚纪念日礼物</a>
                            <a href="http://www.zbird.com/e-education/w16592.html">送闺蜜什么礼物好</a>
                            <a href="http://www.zbird.com/e-education/w17063.html">给老人买什么礼物好</a>

                        </div>
                        <div class="snav_ads">
                            <a href="http://www.zbird.com/act/2017installment.html?from=dzxl"><img
                                    src="http://imu.zbird.cn/608/82/60882_1" alt="" width="611" height="262"></a>
                        </div>
                    </div>

                </li>
                <li>
                    <a href="">体验中心</a>
                    <div class="m_idx_snav_wp">
                        <div class="snav_title">
                            <a href="#" class="snav_title_txtimg">体验中心</a>
                            <a href="#" class="snav_title_txt">探索全部体验中心</a>
                            <div class="snav_lst">
                                <a href="http://shanghai.zbird.com/">上海体验中心</a>
                                <a href="http://beijing.zbird.com/">北京体验中心</a>
                                <a href="http://guangzhou.zbird.com/">广州体验中心</a>
                                <a href="http://hangzhou.zbird.com/">杭州体验中心</a>
                                <a href="http://chengdu.zbird.com/">成都体验中心</a>
                                <a href="#">宿迁体验中心</a>
                                <a href="#">苏州体验中心</a>
                            </div>
                        </div>
                        <div class="snav_lst">
                            <a href="http://nanjing.zbird.com/">南京体验中心</a>
                            <a href="#">合肥包河万达体验中心</a>
                            <a href="http://tianjin.zbird.com/">天津体验中心</a>
                            <a href="#">盐城体验中心</a>
                            <a href="#">常州体验中心</a>
                            <a href="#">烟台体验中心</a>
                        </div>
                        <div class="navline"></div>
                        <div class="snav_lst lstpoa">
                            <a href="#">武汉体验中心</a>
                            <a href="#">西安体验中心</a>
                            <a href="#">郑州体验中心</a>
                            <a href="#">济宁体验中心</a>
                            <a href="#">丽水体验中心</a>
                            <a href="#">盐城金鹰体验中心</a>
                            <a href="#">重庆大都会体验中心</a>
                            <a href="#" target="_blank" style="color:#fdb2a4">查看全部</a>
                        </div>
                        <div class="snav_ads">
                            <a href="#"><img src="http://imu.zbird.cn/416/02/41602_1" alt="" width="611"
                                    height="262"></a>
                        </div>
                    </div>
                </li>
            </ul>
            <ol>
                <li><a href="">商务加盟</a></li>
                <li><a href="">品牌故事</a></li>
                <li><a href="">鸟巢论坛</a></li>
            </ol>

        </div>
    </nav>

    <!-- 宽幅图片 -->
    <div class="wide_pic">
        <!-- <div class="now">
            <p>
                <b>
                    首页 &nbsp; >
                </b>
                <span>

                </span>

                <i>

                </i>

            </p>
        </div> -->
    </div>

    <div class="list">
        <div class="left">
            <div class="sec">
                <ul>
                    <li>
                        <h5 class="iconfont icon-triangle-right">钻石</h5>
                        <p>
                            <a href="">GIA钻石</a>
                            <a href="">30分钻石</a>
                            <a href="">50分钻石</a>
                            <a href="">北极光钻石</a>
                        </p>
                    </li>
                    <li>
                        <h5 class="iconfont icon-triangle-right">钻戒</h5>
                        <p>
                            <a href="">铂金钻戒</a>
                            <a href="">30分钻石</a>
                            <a href="">50分钻石</a>
                            <a href="">70分钻石</a>
                            <a href="">克拉钻戒</a>
                        </p>

                    </li>
                    <li>
                        <h5 class="iconfont icon-triangle-right">对戒</h5>
                        <p>

                            <a href="">铂金对戒</a>
                            <a href="">18K金对戒</a>
                        </p>
                    </li>
                    <li>
                        <h5 class="iconfont icon-triangle-right">配饰</h5>
                        <p>
                            <a href="">吊坠</a>
                            <a href="">耳钉</a>
                            <a href="">套链</a>
                            <a href="">项链</a>
                            <a href="">手链</a>
                        </p>
                    </li>
                </ul>
            </div>
            <h6>
                热卖推荐
            </h6>
            <ol>
                <li>
                    <img src="http://im1.zbird.cn/picdb/555/505/a837819edef3d88add5e934d704c2424.jpg" alt="">
                </li>
                <li>
                    <img src="http://img.zbird.cn/picdb/555/505/887a59cca10d51d19213018cb5ef7355.jpg" alt="">
                </li>
                <li>
                    <img src="http://im1.zbird.cn/ww3/weddings/pic_lst_lft_01.jpg" alt="">
                </li>
            </ol>
        </div>

        <script>
            $('h5').on('click', function () {
                $(this).toggleClass("iconfont icon-triangle-right iconfont icon-sanjiao1")
                    .siblings('p').slideToggle(500)
            })
        </script>

        <div class="right">
            <div class="shai">
                <ul>
                    <li>
                        <span class="tit">价&nbsp;&nbsp;&nbsp;&nbsp;格</span>
                        <span>不限</span>
                        <span><a href="#">1000-3000</a></span>
                        <span><a href="#">3000-6000</a></span>
                        <span><a href="#">6000-10000</a></span>
                        <span><a href="#">10000-20000</a></span>
                        <span><a href="#">20000以上</a></span>
                    </li>

                    <li>
                        <span class="tit">主钻石重</span>
                        <span>不限</span>
                        <span><a href="#">30分以下</a></span>
                        <span><a href="#">30-39分</a></span>
                        <span><a href="#">40-49分</a></span>
                        <span><a href="#">50-59分</a></span>
                        <span><a href="#">60-99分</a></span>
                        <span><a href="#">克拉钻</a></span>
                    </li>
                    <li>
                        <span class="tit">材&nbsp;&nbsp;&nbsp;&nbsp;质</span>
                        <span>不限</span>
                        <span><a href="#">Pt铂金</a></span>
                        <span><a href="#">18K金</a></span>
                        <span><a href="#">Pt铂金-18K金</a></span>
                    </li>

                    <li class="dong">
                        <span class="tit">类&nbsp;&nbsp;&nbsp;&nbsp;别</span>
                        <span>不限</span>
                        <span><a href="#">女戒</a></span>
                        <span><a href="#">花戒</a></span>
                        <span><a href="#">排戒</a></span>
                    </li>

                    <li class="dong">
                        <span class="tit">戒臂装饰</span>
                        <span>不限</span>
                        <span><a href="#">镂空</a></span>
                        <span><a href="#">无装饰</a></span>
                        <span><a href="#">小钻</a></span>
                    </li>
                    <li class="dong">
                        <span class="tit">镶嵌爪形</span>
                        <span>不限</span>
                        <span><a href="#">四爪</a></span>
                        <span><a href="#">六爪</a></span>
                        <span><a href="#">其他爪形</a></span>
                    </li>
                    <li class="dong">
                        <span class="tit">主钻形状</span>
                        <span>不限</span>
                        <span><a href="#">圆形</a></span>
                        <span><a href="#">异形</a></span>
                    </li>
                    <li class="button_C" style=" float:left; width:945px; height:25px;">
                        <div class="button_border " state="close">
                            展开高级搜索
                        </div>
                        <!-- <div class="button_border " state="open">
                            收起高级搜索
                        </div> -->
                    </li>
                </ul>
            </div>
            <div class="tab_tou">
                <ul>
                    <li><a href="">现货速发</a></li>

                    <li><a href="">优选定制</a></li>
                </ul>

            </div>
            <div class='tab_list'>
                <ol class="order">
                    <li>默认</li>
                    <li>销量</li>
                    <li>价格</li>
                    <li>评价</li>
                    <li>新品</li>
                </ol>
            </div>

            <div class="tab_list_main">
                <ul>

                </ul>
            </div>





            <div id="page"></div>

        </div>

        <script>
            // $('.shai ul li').nextAll(3).addClass('')
            $('.button_border').click(function () {

                $('.shai ul li').nextAll(3).toggleClass('active')

                if ($('.shai ul li').nextAll(3).attr('class') === 'active') {
                    $('.button_border').attr('state')
                }
            })
        </script>








    </div>
    <script src="./javascripts/page.js"></script>
    <script src="./javascripts/index-nav.js"></script>
    <script src="./javascripts/goods-list.js"></script>
</body>

</html>